<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>注册登录</title>
	<meta charset="UTF-8"/>
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"/>
	<link rel="stylesheet" th:href="@{css/weui.css}"/>
	<link rel="stylesheet" th:href="@{css/jquery-weui.css}"/>
	<link rel="stylesheet" th:href="@{css/lgrg.css}"/>
	<script type="text/javascript" th:src="@{js/jquery-2.1.4.js}"></script>
	<script type="text/javascript" th:src="@{js/jquery-weui.js}"></script>
	<script type="text/javascript" th:src="@{js/layer.js}"></script>
</head>
<script th:inline="javascript">

$(document).ready(function(){
	$("#mobile-tab").click(function(){
		$("#regtype").val(1);
		$(this).addClass('active');
		$("#mobile-part").show();

	});
});

</script>
<body>
	<!--<body class="page">-->
	<div class="hd">
        <h1 class="page_title"><img alt="" width="80px"  height="80px" th:src="@{img/logo.jpg}"></img></h1>
		<!--<img width="80"  height="80" th:src="@{/img/logo.jpg}"></img>-->
        <p class="page_desc">快速登录</p>
   	</div>
    	
    	<!--<div class="tab-change">-->
		    <!--<span id="mobile-tab" class="reg-part mobile-reg active">手机注册</span>-->
		<!--</div>-->
		
		 <form method="post" th:action="@{/ajax/register}" id="from" name="from">
			<input type="hidden" id="regtype"   name="regtype" value="1"></input>
			<!--手机注册-->
			<div id="mobile-part" style="display:block;">
				<!--<span id="errorMsg" th:text="${msg}"></span>-->
				    <div class="weui_cells">
				        <div class="weui_cell">
				            <div class="weui_cell_hd"></div>
				            <div class="weui_cell_bd weui_cell_primary">
				                <input class="weui_input" type="text" pattern="[0-9]*"  name="tel" id="tel" placeholder="请输入11位手机号"></input>
				            </div>
				        </div>
				    </div>
			</div>			
		    <div class="weui_cells">
		        <div class="weui_cell">
		            <div class="weui_cell_hd"></div>
		            <div class="weui_cell_bd weui_cell_primary">
		                <input class="weui_input"  type="text" name="number" maxlength="6" pattern="[0-9]*" placeholder="请输入您收到的验证码"></input>
		            </div>
		            <div class="weui_cell_ft">
		                <button typew2="button" class="mobile-msg" onclick="timeout(this);" >发送验证码</button>
		            </div>
		        </div>
	        </div>
			
		    <div class="weui_btn_area">
		    	<input type="submit"  class="weui_btn weui_btn_primary"   value="登录"></input>
			</div>
	</form>	
	
	<div class="tc blue" >
	    <p >注册及代表同意</p>
	    <!--  <p ><a class="blue" href="<%=path %>/secret">《隐私条款》</a></p>-->
	</div>
	
<script type="text/javascript">
	$(function(){
		$("#from").submit(function(){
			var $form = $(this);
			$.post($form.attr("action"), $form.serialize(), function(data){
				if (data.code === 0) {
					layer.msg("注册成功", {shift: 1});
					<!--setTimeout(function(){window.location.href = "<%=path %>/login";}, 1200);-->
					return false;
				} else {
					$("#image_code").click();
					layer.msg(data.message, {shift: 6});
					return false;
				}
			}, "json");
			return false;
		});
	});
	
	
	function timeout(dom){
		var regType=from.regtype.value;
		//设置按钮不可点击
		dom.setAttribute('disabled',true);
		//开始倒计时
	    countDown(dom); 
	    //ajax发送验证码
	    sendRegSMS();
	}
	
	function sendRegSMS(){
		<!--$.showLoading("正在发生验证...");-->
		var tel=from.tel.value;
		$.post("/ajax/sendSMS",
		    {
			tel:tel,
		    },
		    function(res){
		    	$.hideLoading();
		    	if (res.code == 0) {
		    		layer.msg("注册手机验证码发送成功", {shift: 1});
		    	}else{
		    		$("#image_code").click();
		    		layer.msg(res.message, {shift: 6});
		    	}
		    }); 
	}
	
	function countDown(dom){
        var sTime = 60,     //倒计时的时间
            timer = null;

        clearTimeout(timer);
        timer = setTimeout(function () {
            if(sTime == 0){
            	 dom.removeAttribute('disabled');
            	 dom.innerHTML = "发送验证码";
                 clearTimeout(timer);
                 return false;
            }else{
                sTime--;
                setTimeout(arguments.callee, 1000);
            }
            dom.innerHTML = "("+sTime+"/60s)";
        },1000);
    }
</script>
</body>
</html>